<template>
  <div class="about">
    <div id="allmap"></div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      loading: true,
      wechatLoginFlag: false,
      wechatQrCode: "",
    }
  },
  props: {
    prop: {
      type: String,
      required: false,
    },
  },
  components: {},
  computed: {},
  watch: {},
  methods: {
    createMap() {
      var map = new BMapGL.Map('allmap'); // 创建Map实例
      map.centerAndZoom(new BMapGL.Point(117.144737,39.227527), 14); // 初始化地图,设置中心点坐标和地图级别
      map.enableScrollWheelZoom(true); // 开启鼠标滚轮缩放
      // 创建点标记
      var marker1 = new BMapGL.Marker(new BMapGL.Point(117.144737,39.227527));
      var marker2 = new BMapGL.Marker(new BMapGL.Point(116.404, 39.915));
      var marker3 = new BMapGL.Marker(new BMapGL.Point(116.395, 39.935));
      var marker4 = new BMapGL.Marker(new BMapGL.Point(116.415, 39.931));
      // 在地图上添加点标记
      map.addOverlay(marker1);
      map.addOverlay(marker2);
      map.addOverlay(marker3);
      map.addOverlay(marker4);
    },
  },
  created() {

  },
  mounted() {
    this.createMap()
  },
  updated() {

  },
  destroyed() {

  },
  filters: {},
}
</script>
<style>
@media (min-width: 1024px) {
  .about {
    min-height: 100vh;
    display: flex;
    align-items: center;
    border: 1px solid #dcdfe6;
  }
}
#allmap {
  overflow: hidden;
  width: 100%;
  height: 100%;
  margin: 0;
  font-family: "微软雅黑";
}
</style>
